import {useCountStore} from "./CountStore.tsx";

export function Counter() {
  const {  text, updateText,TestBuilder } = useCountStore();
  console.log("=========================text TestBuilder ===================")
  console.log('Count Render text')

  return (
    <div>
      <button onClick={updateText}>Text: {text}</button>
      <TestBuilder/>
    </div>
  );
}

export function Counter3() {
    const {  text, updateText } = useCountStore();

    console.log("=========================text  ===================")
    console.log('Count 3 Render')

    return (
        <div>
            <button onClick={updateText}>Text: {text}</button>
        </div>
    );
}
export function Counter4() {
    const {  count,increment } = useCountStore();
    console.log("=========================count  ===================")
    console.log('Count 4 render')

    return (
        <div>
            <button onClick={increment}>Text: {count}</button>
        </div>
    );
}
export function Counter2() {
    const { TestBuilder } = useCountStore();
    console.log("=========================TestBuilder  ===================")
    console.log('Count2')


    return (
        <div>
            {/*<button onClick={increment}>Count: {count}</button>*/}
            <TestBuilder/>
        </div>
    );
}
